Mostrar los tags: cuenta atrás

Mostrando del 1 al 3 de 3 coincidencias
<<>>
Se ha buscado por el tag: cuenta atrás
Imágen de perfil

Cuenta atrás con barra de progreso en javascript


JavaScript

estrellaestrellaestrellaestrellaestrella(1)
Actualizado el 5 de Enero del 2021 por Xve (294 códigos) (Publicado el 27 de Noviembre del 2018)
5.875 visualizaciones desde el 27 de Noviembre del 2018
Este código realiza una cuenta atrás utilizando "animation" de CSS para mostrar la barra de progreso y javascript para mostrar los valores a cada segundo.

Actualmente la cuenta atrás va de 10 a 0, pero si se desea modificar, se debe modificar la variable "contador" de js y el estilo "animation" de CSS poniendo en los dos lados el mismo valor.

La cuenta atrás, es iniciada desde javascript a los 500 milisegundos de cargar la pagina.

Se especifica la anchura de la barra en la case "meter" de css.

Una vez finalizado el tiempo, se ejecuta la función de js finalCuantaAtras() para poder ejecutar cualquier proceso.

cuenta-atras-barra-de-progreso


Si deseas ver una versión similar con botón para iniciar y/o reiniciar: https://www.lawebdelprogramador.com/codigo/JavaScript/6808-Cuenta-atras-con-barra-de-progreso-en-JavaScript.html
Imágen de perfil

Cuenta atrás con barra de progreso en JavaScript


JavaScript

Publicado el 5 de Enero del 2021 por Xve (294 códigos)
3.280 visualizaciones desde el 5 de Enero del 2021
Este código realiza una cuenta atrás utilizando "animation" de CSS para mostrar la barra de progreso y javascript para mostrar los valores a cada segundo.

Actualmente la cuenta atrás va de 5 a 0, pero si se desea modificar, se debe modificar la variable "seconds" de js y el estilo ".start span:nth-child(1)" de CSS poniendo en los dos lados el mismo valor.

La cuenta atrás, se inicia en el momento de pulsar el botón "start", y si se pulsa mientras esta activa la cuenta atrás, se reinicia.

Se especifica la anchura y altura de la barra en el estilo "animation" de css.

cuenta-atras-js-y-css
Imágen de perfil

Cuenta atras con barra de progreso con JQuery


JQuery

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 27 de Noviembre del 2018 por Xve (294 códigos)
3.205 visualizaciones desde el 27 de Noviembre del 2018
Este código realiza una cuenta atrás utilizando "animation" de CSS para mostrar la barra de progreso y jquery para mostrar los valores a cada segundo.

Actualmente la cuenta atrás va de 10 a 0, pero si se desea modificar, se debe modificar la variable "contador" de js y el estilo "animation" de CSS poniendo en los dos lados el mismo valor.

La cuenta atrás, es iniciada desde jquery a los 500 milisegundos de cargar la pagina.

Se especifica la anchura de la barra en la case "meter" de css.

Una vez finalizado el tiempo, se ejecuta la función de js finalCuantaAtras() para poder ejecutar cualquier proceso.

cuenta-atras-barra-de-progreso